<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--<ul id="myLinks">-->
        <!--<li id="goSomewhere">Go somewhere</li>-->
        <!--<li id="doSomething">Do something</li>-->
        <!--<li id="sayHi">Say Hi</li>-->
    <!--</ul>-->
    <!--<script src="app.js" type="text/javascript"></script>-->
    <script src="./public/js/jquery-3.1.1.min.js" type="text/javascript"></script>
</head>
<body>
<canvas id="drawing" width="200" height="200">A drawing of something.</canvas>
<script>
    var drawing = document.getElementById("drawing");
    if(drawing.getContext){
        var context = drawing.getContext("2d");
        context.beginPath();
//        绘制外圆
        context.arc(100,100,99,0,2*Math.PI,false);
//        绘制内圆
        context.moveTo(194,100);
        context.arc(100,100,94,0,2*Math.PI,false);
//        绘制分针
        context.moveTo(100,100);
        context.lineTo(100,15);
//        绘制时针
        context.moveTo(100,100);
        context.lineTo(35,100);
        context.stroke();
    }
</script>
</body>
</html>